UE.plugins['upimgmove'] = function () {
  let me = this
  let upimgmove = {
    options: this,
    moveInImg: true,
    move: null,
    button: null,
    target: null
  }

  upimgmove.move = function () {
    upimgmove.moveInImg = true
    upimgmove.button.style.display = 'none'
    upimgmove.target.removeEventListener('mouseout', upimgmove.move)
  }

  upimgmove.init = function () {
    this.button = document.createElement('div');
    let input = document.createElement('input');
    input.style.cssText = ';position: absolute;top: -100px;';
    window.UE.dom.domUtils.setAttributes(input, {type: 'file', id: 'upimgmove'});

    let label = document.createElement('label');
    window.UE.dom.domUtils.setAttributes(label, {for: 'upimgmove'});
    label.innerText = '上传';
    label.style.cssText = ';display: block;width: 55px;height: 30px;';
    this.button.appendChild(label);
    this.button.appendChild(input);

    this.button.style.cssText += ';cursor: pointer;width: 55px;overflow:hidden; height: 30px;line-height: 30px;text-align:center; border:1px solid #21a5b2;background: #21a5b2;color:#fff;position: absolute;z-index:' + (9999) + ';';
    this.button.addEventListener("mouseover", function(){
      this.style.display = "block";
    });
    me.ui.getDom().appendChild(this.button);
    window.UE.dom.domUtils.on(input, 'change', function (e) {
      window.UE.dom.domUtils.addClass(upimgmove.target, 'loadingclass');
      upimgmove.target.src = `${me.options.themePath}${me.options.theme}/images/spacer.gif`
      window.UE.vue.$upload.simple(
        // TODO
        {target: e.target},
        {
          subSystem: window.UE.vue.subSystem,
          fileOwnerType: window.UE.vue.fileOwnerType
        }
      ).then(file => {
        upimgmove.target.setAttribute('src', file.blob);
        upimgmove.target.setAttribute('fileuuid', file.fileUuid);
        upimgmove.target.setAttribute('_src', file.blob);
        upimgmove.target.setAttribute('title', '');
        upimgmove.target.removeAttribute('id');
        window.UE.dom.domUtils.removeClasses(upimgmove.target, 'loadingclass');
      })
    })
  }

  upimgmove.attachTo = function () {
    let target = this.target;
    let button = this.button;
    let imgPos = window.UE.dom.domUtils.getXY(target);

    window.UE.dom.domUtils.setStyles(button, {
      'left': imgPos.x + target.width - me.document.body.scrollLeft - 65 + 'px',
      'top':  imgPos.y - me.document.body.scrollTop + 10 + 'px'
    });
  }

  function mouseMoveEvent(e) {
    if (e.target.tagName === 'IMG') {
      if (upimgmove.moveInImg) {
        upimgmove.moveInImg = false
        upimgmove.target = e.target
        if (!upimgmove.button) {
          upimgmove.init()
        } else {
          upimgmove.button.style.display = 'block'
        }
        upimgmove.attachTo()
        upimgmove.target.addEventListener('mouseout', upimgmove.move)
      }
    }
  }
  me.ready(function () {
    window.UE.dom.domUtils.on(me.document, 'mousemove', mouseMoveEvent);
  });
};
